﻿@model myFinance.Models.Pessoa
@{
	ViewBag.Title = "Perfil";
}
<!DOCTYPE html>
<html>
<head>
    <title>Cadastro</title>
    @if (false)
    {
        <script type="text/javascript" src="../../Scripts/jquery-1.6.4-vsdoc.js"></script>
        <script type="text/javascript" src="../../Scripts/jquery.validate-vsdoc.js"></script>
        <script type="text/javascript" src="../../Scripts/jquery.validate.js"></script>
        <script src="../../Scripts/script.js" type="text/javascript"></script>
    }
    @if (!Request.IsAjaxRequest())
    {
        <link href="@Url.Content("~/Content/SiteRestrito.css")" rel="stylesheet" type="text/css" />
@*<link href="@Url.Content("~/Content/SiteRestrito-min.css")" rel="stylesheet" type="text/css" />*@
        <link href="@Url.Content("~/Content/fancybox/fancybox-1.3.4.css")" rel="stylesheet" type="text/css" />
        <script src="@Url.Content("~/Scripts/jquery-1.6.4.min.js")" type="text/javascript"></script>
        <script src="@Url.Content("~/Scripts/script.js")" type="text/javascript"></script>
        <script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script>
        <script src="@Url.Content("~/Scripts/jquery.maskedinput-1.3.min.js")" type="text/javascript"></script>
        <script src="@Url.Content("~/Scripts/jquery.fancybox-1.3.4-min.js")" type="text/javascript"></script>    
        <script src="@Url.Content("~/Scripts/jquery.easing-1.3.pack.js")" type="text/javascript"></script>    
        <script src="@Url.Content("~/Scripts/numbers.js")" type="text/javascript"></script>
    }
    <style type="text/css">
        input[type="text"], input[type="password"], input[type="text"].datepicker, input[type="text"].datepicker-readonly
        {
            font-size: 0.9em;
            line-height: 16px;
            height: 16px;
        }
        .editor-label
        {
            margin: 0.5em 0.5em 0 0;
            line-height: 16px;
            height: 16px;
            width: 150px;
            font-size: 13px;
            padding-top: 4px;
            padding-bottom: 0;
        }
        .editor-field
        {
            margin: 0.5em 0 2px 0;
            line-height: 16px;
            height: 16px;
        }
        #corpo
        {
            height: 500px;
            margin: auto;
            width: 900px;
            padding: 0;
        }
        #avatar
        {
            float: right;
            width: 250px;
            height: 410px;
        }
        #cad
        {
            float: left;
            height: 410px;
            width: 650px;
            margin-bottom: 15px;
        }
        #Nome, #Email
        {
            width: 348px;
        }
        #Bairro, #Complemento, #Twitter, #Msn, #Blog, #Site
        {
            width: 350px;
        }
        #DataNascimento, #CEP
        {
            width: 148px;
        }
        #CPF
        {
            width: 148px;
            margin-left: 35px;
        }
        #DataCadastro, #Usuario, #FoneResidencial, #FoneComercial, #FoneCelular, #RG
        {
            width: 150px;
        }
        #DataCadastro
        {
            margin-left: 36px;
        }
        #Endereco, #Cidade
        {
            width: 286px;
        }
        #Numero
        {
            width: 48px;
            font-size: 0.9em;
        }
        #UF
        {
            width: 46px;
        }
    </style>
</head>
<body>
    <div id="corpo">
        <div id="cad">
            @using (Html.BeginForm("Cadastro", "Perfil", FormMethod.Post, new { id = "formperfil" }))
            {
                @Html.ValidationSummary(true)
                
                @Html.HiddenFor(model => model.Id)
                @Html.HiddenFor(model => model.Avatar)
                <div class="editor-label">
                    @Html.LabelFor(model => model.Usuario, Model.Id > 0 ? "Usuário / Data Cad.: " : "Usuário: ")
                </div>
                <div class="editor-field">
                    @Html.TextBoxFor(model => model.Usuario, new { @class = "readonly", @readonly = "readonly", tabindex = "-1" })
                    @Html.ValidationMessageFor(model => model.Usuario)
                    @if (@Model.Id > 0)
                    {                
                        @Html.TextBox("DataCadastro", Model.DataCadastro.ToShortDateString(), new { maxlength = 10, @class = "datepicker-readonly", @readonly = "readonly", tabindex = "-1" })
                        @Html.ValidationMessageFor(model => model.DataCadastro)                
                    }
                    else
                    {
                        @Html.HiddenFor(model => model.DataCadastro)
                    }
                </div>
                <div class="editor-label">
                    @Html.LabelFor(model => model.Nome, "Nome: ")
                </div>
                <div class="editor-field">
                    @Html.TextBoxFor(model => model.Nome, new { maxlength = 150, @class = "obrigatorio" })
                    @Html.ValidationMessageFor(model => model.Nome)
                </div>
                <div class="editor-label">
                    @Html.LabelFor(model => model.DataNascimento, "Data de Nascimento: ")
                </div>
                <div class="editor-field">
                    @Html.TextBoxFor(model => model.DataNascimento, new { maxlength = 10, @class = "obrigatorio datepicker" })
                    @Html.ValidationMessageFor(model => model.DataNascimento)
                    @Html.RadioButtonFor(model => model.Sexo, false, new { id = "masculino", style = "margin-left: 35px;" })
                    <label for="masculino">
                        <img src="@Url.Content("~/Content/imagens/male.png")" alt="Masculino" />
                    </label>
                    @Html.RadioButtonFor(model => model.Sexo, true, new { id = "feminino" })
                    <label for="feminino">
                        <img src="@Url.Content("~/Content/imagens/female.png")" alt="Feminino" /></label>
                </div>
                <div class="editor-label">
                    @Html.LabelFor(model => model.RG, "RG / CPF: ")
                </div>
                <div class="editor-field">
                    @Html.TextBoxFor(model => model.RG, new { maxlength = 30 })
                    @Html.ValidationMessageFor(model => model.RG)
                    @Html.TextBoxFor(model => model.CPF, new { maxlength = 30 })
                    @Html.ValidationMessageFor(model => model.CPF)
                </div>
                <div class="editor-label">
                    <label for="CEP">
                        CEP (<a href="http://www.correios.com.br" target="_blank" tabindex="-1">Não sabe o CEP?</a>):
                    </label>
                </div>
                <div class="editor-field" style="width: 300px">
                    @Html.TextBoxFor(model => model.CEP, new { maxlength = 9 })
                    <input type="button" id="pesquisacep" value="" class="botao-pesquisar" />
                    @Html.ValidationMessageFor(model => model.CEP)
                </div>
                <div class="editor-label">
                    @Html.LabelFor(model => model.Endereco, "Endereço: ")
                </div>
                <div class="editor-field">
                    @Html.TextBoxFor(model => model.Endereco, new { maxlength = 150 })
                    @Html.TextBoxFor(model => model.Numero, new { maxlength = 6, @class = "integer" })
                    @Html.ValidationMessageFor(model => model.Endereco)
                </div>
                <div class="editor-label">
                    @Html.LabelFor(model => model.Cidade, "Cidade/UF: ")
                </div>
                <div class="editor-field">
                    @Html.TextBoxFor(model => model.Cidade, new { maxlength = 150 })
                    @Html.TextBoxFor(model => model.UF, new { maxlength = 2 })
                    @Html.ValidationMessageFor(model => model.UF)
                </div>
                <div class="editor-label">
                    @Html.LabelFor(model => model.Bairro, "Bairro: ")
                </div>
                <div class="editor-field">
                    @Html.TextBoxFor(model => model.Bairro, new { maxlength = 100 })
                    @Html.ValidationMessageFor(model => model.Bairro)
                </div>
                <div class="editor-label">
                    @Html.LabelFor(model => model.Complemento, "Complemento: ")
                </div>
                <div class="editor-field">
                    @Html.TextBoxFor(model => model.Complemento, new { maxlength = 100 })
                    @Html.ValidationMessageFor(model => model.Complemento)
                </div>
                <div class="editor-label">
                    @Html.LabelFor(model => model.FoneResidencial, "Fones Resid / Com:")
                </div>
                <div class="editor-field">
                    <div style="width: 180px; float: left">
                        @Html.TextBoxFor(model => model.FoneResidencial, new { maxlength = 14, @class = "fone" })
                        @Html.ValidationMessageFor(model => model.FoneResidencial)
                    </div>
                    <div style="margin-left: 20px; float: left">
                        @Html.TextBoxFor(model => model.FoneComercial, new { maxlength = 14, @class = "fone" })
                        @Html.ValidationMessageFor(model => model.FoneComercial)
                    </div>
                </div>
                <div class="editor-label">
                    @Html.LabelFor(model => model.FoneCelular, "Fone Celular:")
                </div>
                <div class="editor-field">
                    @Html.TextBoxFor(model => model.FoneCelular, new { maxlength = 14, @class = "fone" })
                    @Html.ValidationMessageFor(model => model.FoneCelular)
                </div>
                <div class="editor-label">
                    @Html.LabelFor(model => model.Email, "E-mail: ")
                </div>
                <div class="editor-field">
                    @Html.TextBoxFor(model => model.Email, new { maxlength = 100, @class = "obrigatorio" })
                    @Html.ValidationMessageFor(model => model.Email)
                </div>
                <div class="editor-label">
                    @Html.LabelFor(model => model.Twitter, "Twitter (@): ")
                </div>
                <div class="editor-field">
                    @Html.TextBoxFor(model => model.Twitter, new { maxlength = 30 })
                    @Html.ValidationMessageFor(model => model.Twitter)
                </div>
                <div class="editor-label">
                    @Html.LabelFor(model => model.Msn, "MSN: ")
                </div>
                <div class="editor-field">
                    @Html.TextBoxFor(model => model.Msn, new { maxlength = 100 })
                    @Html.ValidationMessageFor(model => model.Msn)
                </div>
                <div class="editor-label">
                    @Html.LabelFor(model => model.Site, "Site / Blog: ")
                </div>
                <div class="editor-field">
                    @Html.TextBoxFor(model => model.Site, new { maxlength = 100 })
                    @Html.ValidationMessageFor(model => model.Site)
                </div>
                <div class="editor-label">
                    &nbsp;
                </div>
                <div class="editor-field" style="float: right; padding-right: 130px; margin-top: 15px;">
                    <input type="submit" value="Gravar" />
                    <input type="button" value="Cancelar" id="cancelar" />
                </div>
            }
        </div>
        <div id="avatar">
            <iframe src="@Url.Action("IncluirAvatar", "Perfil")" width="250" height="410" seamless>
            </iframe>
        </div>
        <a href="#" id="winAvatar" style="display: none;"></a>
    </div>
    <script type="text/javascript">
        var cepAntigo = "";
        var incluirAvatar = false;
        $(function () {
            $.validator.unobtrusive.parse($('#formperfil'));
            $('#CEP').mask('99999-999');
            $('#CPF').mask('999.999.999-99');
            $('#Numero').rules('remove')            
            $('.fone').mask('(99) 9999-9999');
            $('.datepicker').mask('99/99/9999');            
            if ('@Model.Id' == 0) {
                $('#DataNascimento').val('');
            } else {
                cepAntigo = '@Model.CEP';
            }
            $('#pesquisacep').click(function () {
                var cep = $('#CEP').val();
                if (cep == '') {
                    $('#CEP').valid();
                } else {
                    if (cep != cepAntigo) {
                        if (!cep == "") {
                            $('#Endereco').addClass('loading').val('');
                            $('#Bairro').addClass('loading').val('');
                            $('#Cidade').addClass('loading').val('');
                            $('#UF').addClass('loading').val('');
                            $.getScript("http://cep.republicavirtual.com.br/web_cep.php?formato=javascript&cep=" + cep, function () {
                                if (resultadoCEP["resultado"] > 0) {
                                    $('#Endereco').removeClass('loading').val(unescape(resultadoCEP["tipo_logradouro"]) + " " + unescape(resultadoCEP["logradouro"]));
                                    $('#Bairro').removeClass('loading').val(unescape(resultadoCEP["bairro"]));
                                    $('#Cidade').removeClass('loading').val(unescape(resultadoCEP["cidade"]));
                                    $('#UF').removeClass('loading').val(unescape(resultadoCEP["uf"]));
                                    cepAntigo = cep;
                                    if ($('#Endereco').val() == '') {
                                        $('#Endereco').focus();
                                    } else {
                                        $('#Numero').focus();
                                    }
                                } else {
                                    alert("Endereço não encontrado.");
                                    $('#Endereco').removeClass('loading').val('');
                                    $('#Bairro').removeClass('loading').val('');
                                    $('#Cidade').removeClass('loading').val('');
                                    $('#UF').removeClass('loading').val('');
                                    $('#CEP').val('').focus();
                                    cepAntigo = "";
                                }
                            });
                        } else {
                            $('#Endereco').removeClass('loading').val('');
                            $('#Bairro').removeClass('loading').val('');
                            $('#Cidade').removeClass('loading').val('');
                            $('#UF').removeClass('loading').val('');
                            cepAntigo = "";
                        }
                    }
                }
            });
            loadPage();
            hideLoading();
            window.location.hash = '#Perfil';
            $('#Nome').focus();
        });
        $('#formperfil').submit(function (e) {
            if ($('#formperfil').valid()) {
                e.preventDefault();
                showLoading();
                $.ajax({
                    url: '@Url.Action("Cadastro", "Perfil")',
                    type: 'POST',
                    dataType: 'json',
                    data: $('#formperfil').serialize(),
                    error: function () {
                        alert('Houve um erro na requisição dos dados!\nPor favor, entre em contato com o Administrador do seu sistema.');
                        hideLoading();
                    },
                    success: function (data) {
                        if (data) {
                            setTimeout("redirect()", 3000);
                        } else {
                            alert(data.erro);
                            hideLoading();
                        }
                    },
                    statusCode: {
                        500: function () {
                            alert('ERROR TYPE: 500 Internal Server Error\n\nHouve um erro na resposta do servidor.\nPor favor, entre em contato com o Administrador do seu sistema.');
                            hideLoading();
                        },
                        404: function () {
                            alert('ERROR TYPE: 404 Not Found\n\nA URL requisitada não existe.\nPor favor, entre em contato com o Administrador do seu sistema.');
                            hideLoading();
                        }
                    }
                });
            }
        });
        function redirect() {
            window.location.href = '@Url.Action("Index", "Home")';
        }
        $('#cancelar').click(function () {
            showLoading();
            $('section#main').load('@Url.Action("Index", "Home")');
        });
        $("#winAvatar").fancybox({
            'autoScale': true,
            'autoDimensions': false,
            'width': 770,
            'height': 600,
            'transitionIn': 'fade',
            'transitionOut': 'fade',
            'showCloseButton': true,
            'hideOnOverlayClick': false,
            'hideOnContentClick': false,
            'content': '@Url.Action("EditarAvatar", "Perfil")',
            'type': 'inline',
            'onClosed': function () {
                var iframe = window.frames;
                iframe[0].$('#Incluir').val('não');
                if (incluirAvatar) {
                    iframe[0].document.location.href = '@Url.Action("IncluirAvatar", "Perfil")';
                }
            }
        });
	</script>
</body>
</html>
